import React from "react"
import { navigate } from "gatsby"
import { NavBar, Icon, Button, WhiteSpace } from "antd-mobile";
import detailsList from '../../services/task/details.json'


export default (props) => {
    const data = detailsList.filter((item) => {
        // return item.entity.id === props.location.state.id;
        return item;
    })
    const entity = data[0].entity;
    let starusDiv = null;
    switch (entity.taskStatus) {
        case 1:
            starusDiv = <div>任务状态<span>待执行</span></div>
            break;
        case 6:
            starusDiv = <div>任务状态<span>执行中</span></div>
            break;
        case 5:
            starusDiv = <div>任务状态<span>审核中</span></div>
            break;
        default:
            break;
    }
    return <div className="task-details">
        <NavBar mode="light"
            icon={<Icon type="left" />}
            onLeftClick={(e) => { navigate(props.location.state.url) }}
            className="fixd-header"
        >任务详情</NavBar>
        <div className="detail-content page-content">
            <div>任务名称<span>{entity.name}</span></div>
            <div>项目名称<span>{entity.name}</span></div>
            {starusDiv}
            <div>任务描述<span>{entity.description}</span></div>
            <div>需要审核<span>{entity.needAudit ? "是" : "否"}</span></div>
            <div>开始时间<span>{entity.expectStartTime}</span></div>
            <div>开始时间<span>{entity.expectStartTime}</span></div>
            <div>截止时间<span>{entity.taskEndTime}</span></div>
            <div>执行人员<span>{entity.assigneesName}</span></div>
            <div>设备数量<span>{entity.total_rows}</span></div>
            <div>已检设备<span>{entity.checkNumber}</span></div>
            <WhiteSpace /><Button type="warning">提交</Button><WhiteSpace />
        </div>
        <style jsx='true'>{`
            .task-details {
                background-color:#fff;
            }
            .detail-content div {
                font-size: 1.4rem;
                color: #da3932;
                line-height: 5rem;
                padding-left: 2.4rem;
            }
            .detail-content div span {
                color:#333333;
                padding-left:4rem;
            }
        `}</style>
    </div>
}